<template>
	<div>
		<div class="flex">
			<div class="yuan" style="text-align: center;">
				<div class="num1">1</div>
				<div class="word1">申请信息</div>
			</div>
			<div style="border: 2px solid #f2f2f2; width: 50px;margin-bottom: 20px;"></div>
			<div style="text-align: center;">
				<div class="num">2</div>
				<div class="word">证件上传</div>
			</div>
			<div style="border: 2px solid #f2f2f2; width: 50px; margin-bottom: 20px;"></div>
			<div>
				<div class="num1">3</div>
				<div class="word1">病例信息</div>
			</div>
		</div>
		<div class="list">
			<div class="people">
				<div>住院人</div>
				<div style="color: #AAAAAA">请输入住院人姓名</div>
			</div>
			<div class="people" style="border-bottom: 1px solid #f2f2f2;">
				<div>住院号</div>
				<div style="color: #AAAAAA">请输入住院号</div>
			</div>
		</div>
		<div class="put">上传住院人资料</div>
		<div class="text">请拍摄证件原件，并使照片中证件边缘完整，文字清晰，光线均匀。</div>
	    <div class="pic">
			<div style="font-size: 24px;">+</div>
			<div>上传身份证人像面照片</div>
		</div>
		<div class="pic">
			<div style="font-size: 24px;">+</div>
			<div>上传身份证国徽面照片</div>
		</div>
		<div class="pic">
			<div style="font-size: 24px;">+</div>
			<div>上传手持身份证照片</div>
		</div>
		<div class="next" @click="text">下一步</div>
		<div style="height: 50rpx;"></div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
	
			}
		},
		methods: {
			text() {
				uni.navigateTo({
					url: "../../../hospitalizationServices/pages/send/text"
				})
			}
	
		}
	}
</script>

<style>
	.next{
			background:  #006eff;
			border-radius: 8rpx;
			padding: 14rpx 0;
			text-align: center;
			color: #ffffff;
			font-size: 30rpx;
			margin: 70rpx 20rpx;
		}
	.pic{
		margin:15px;
		background: rgb(241, 247, 255);
		font-size: 14px;
		color: #aaaaaa;
		text-align: center;
		padding: 55px 0;
		border-radius: 5px;
	}
	.text{
		margin: 0 15px;
		font-size: 12px;
		color: gainsboro;
		margin-top: 10px;
	}
	.put{
		margin: 0 15px;
		font-size: 15px;
		color: #aaaaaa;
	}
	.people div:nth-child(2) {
		text-align: center;
		flex: 1;
	}

	.people div:nth-child(1) {
		text-align: left;
	}

	.people {
		border-top: 1px solid #f2f2f2;
		padding: 15px 0;
		display: flex;
		font-size: 14px;
	}

	.list {
		margin-top: 15px;
		padding: 15px;

	}

	.num {
		width: 30px;
		height: 30px;
		border-radius: 50%;
		border: 1px solid;
		background: #006eff;
		color: #FFF;
		text-align: center;
		line-height: 30px;
		margin-left: 12px;
		font-size: 14px;
	}

	.num1 {
		width: 30px;
		height: 30px;
		border-radius: 50%;
		border: 1px solid;
		background: #FFF;
		color: #aaaaaa;
		text-align: center;
		line-height: 30px;
		margin-left: 12px;
	}

	.word {
		font-size: 14px;
		margin-top: 8px;
		color: blue;
	}

	.word1 {
		font-size: 14px;
		margin-top: 8px;
		color: #aaaaaa;
	}

	.flex {
		margin-top: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
	}

	.yuan {
		text-align: center;
	}
</style>